import { defineComponent } from 'vue'
import './index.scss'

export const MyButton = defineComponent({
  name: 'MyButton',
  setup () {
    return () => (
      <button class="btn btn-primary">Click me</button>
    )
  }
})
export const BaseAppView = defineComponent({
  setup () {
    return (<div class={'base-app'}>
    <div class={'top-view'}>
      <slot name={'top'}></slot>
    </div>
    <div class={'content-view'}>
      <div class={'left'}>
        <slot name='left'></slot>
      </div>
      <div class={'center'}>
        <div class={'center-top'}>
          <slot name={'center-top'}></slot>
        </div>
        <slot></slot>
        <div class={'center-bottom'}>
          <slot name={'center-bottom'}></slot>
        </div>
      </div>
      <div class={'right'}>
        <slot name={'right'}></slot>
      </div>
    </div>
    <div class={'bottom-view'}>
      <slot name={'bottom'}></slot>
    </div>
    <div class={'seat-view'}>
      <slot name={'seat'}></slot>
    </div>
  </div>)
  }
})
